<template>
  <div id="page-wrapper" class="gray-bg">
    <header-link/>
    <div class="row wrapper border-bottom white-bg page-heading">
      <div class="col-sm-4">
        <h2>课程描述新增</h2>
        <ol class="breadcrumb">
          <li>
            <router-link :to="{ name: 'home' }">
              主页
            </router-link>
          </li>
          <li class="active">
            <strong>课程描述新增</strong>
          </li>
        </ol>
      </div>
    </div>


    <div class="wrapper container wrapper-content animated fadeInUp">
      <div class="ibox">
        <div class="ibox-title">
          <h5>新增</h5>
          <div class="ibox-tools">
            <router-link :to="{ name: 'courseDescription'}" class="btn btn-primary btn-xs">
              <i class="fa fa-back"></i>
              返回列表
            </router-link>
          </div>
        </div>
        <div class="ibox-content">
            <form class="form-horizontal">

              <p>填写课程描述详情</p>
              <div class="form-group">
                <label class="col-lg-2 control-label">
                  学校名称
                  <strong style="color: red"> * </strong>
                </label>
                  <div class="col-lg-10">
                    <input type="email" placeholder=""  v-model="form.schoolname" class="form-control">
                    <span class="help-block m-b-none">请完整填写学校名称（中文）</span>
                  </div>
              </div>
              <div class="form-group">
                <label class="col-lg-2 control-label">
                  课程名称
                  <strong style="color: red"> * </strong>
                </label>
                  <div class="col-lg-10">
                    <input type="text" placeholder=""  v-model="form.name" class="form-control">
                    <span class="help-block m-b-none">请完整填写课程名称（英文）</span>
                  </div>
              </div>
              <div class="form-group">
                <label class="col-lg-2 control-label">课程类别</label>
                  <div class="col-lg-10">
                    <select  class="form-control" v-model="form.other3">
                      <option v-for="item in common.enum.courseTypeList" v-bind:value="item.key" >{{ item.value }}</option>
                    </select>
                  </div>
              </div>
              <div class="form-group">
                <label class="col-lg-2 control-label">主要内容</label>
                  <div class="col-lg-10">
                    <textarea rows="5" cols="20"  v-model="form.other1" class="form-control"></textarea>                    
                  </div>
              </div>
              <div class="form-group">
                <label class="col-lg-2 control-label">课程描述</label>
                  <div class="col-lg-10">
                    <textarea rows="8" cols="20"  v-model="form.description" class="form-control"></textarea>                    
                  </div>
              </div>
              <div class="form-group">
                <label class="col-lg-2 control-label">课本（literature）</label>
                  <div class="col-lg-10">
                    <textarea rows="5" cols="20"  v-model="form.other2" class="form-control"></textarea>                    
                  </div>
              </div>
              <div class="form-group">
                <label class="col-lg-2 control-label">编辑人</label>
                  <div class="col-lg-10">
                    <input type="text" placeholder=""  v-model="form.lastedit" class="form-control">
                    <span class="help-block m-b-none">请填写姓名，方便查找</span>
                  </div>
              </div>
              
              <div class="form-group">
                  <div class="col-lg-offset-2 col-lg-10">
                      <button class="btn btn-sm btn-primary" type="button" v-on:click="save()">保存</button>
                  </div>
              </div>

            </form>
        </div>

      </div>
    </div>
    
  </div>

</template>

<script>
import header from '@/components/Header.vue'
import server from '@/server/server.js'
import common from '@/server/common.js'
export default {
  name: 'demo',
  data () {
    return {
      common: common,
      form: {
        schoolname: '',
        name: '',
        lastedit: '',
        other1: '',
        other2: '',
        other3: '',
        description: '',
      },

    }
  },
  components: {
    'header-link': header
  },
  created () {
  },
  mounted () {
    this.common.enum.courseTypeList[0].value = '请选择';
  },
  methods: {
    save() {
      var vue = this;

      if (confirm("是否确定要编辑该课程描述？")) {
        if (!vue.form.schoolname || !vue.form.name) {
          vue.$toastr('error', '请填写完整学校名称和课程名称', '错误')
        }
        server.post(server.postCourseDescriptionAddUrl, null, vue.form, true, false, this, function(data) {
          vue.$toastr('success', '请在列表中查看', '课程描述新增成功')
          // 跳转课程描述列表页面
          vue.$router.push({ name: 'courseDescription'})
        })

      }



    },
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
#page-wrapper {
  margin: 0;
}
.container {
  margin-top: 20px;
}
</style>
